<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>对象实例化的方式</title>
  </head>

  <body>

  </body>
  <script>
    /* 
    对象实例化的方式
     1.原始模式：这样的写法有两个缺点，一是如果多生成几个（100个！）实例，写起来就非常麻烦；二是实例与原型之间，
       没有任何办法，可以看出没有什么联系。
     2.原始模式的改进：通过写一个函数，解决代码重复的问题。
     3.工厂模式
     4.构造函数模式：为了解决从原型对象生成实例的问题，Javascript提供了一个构造函数（Constructor）模式。 
        所谓”构造函数”，其实就是一个普通函数，但是内部使用了this变量。对构造函数使用new运算符，就能生成实例，并
        且this变量会绑定在实例对象上。加new执行的函数构造内部变化：自动生成一个对象，this指向这个新创建的对象，
        函数自动返回这个新创建的对象
    */
    //1.原始模式：
    var Car = {
      color: 'red', //车的颜色
      wheel: 4, //车轮数量
    }
    var Car2 = {
      color: 'blue',
      wheel: 4,
    }
    alert(Car.color); //red


    //2.原始模式的改进：通过写一个函数，解决代码重复的问题。
    function createCar(color, wheel) {
      return {
        color: color,
        wheel: wheel
      }
    }
    //然后生成实例对象，就等于是在调用函数：
    var cat1 = createCar("红色", "4");
    var cat2 = createCar("蓝色", "4");
    alert(cat1.color); //红色

    //3.工厂模式
    function createCar(color, wheel) { //createCar工厂
      var obj = new Object(); //或obj = {} 原材料阶段
      obj.color = color; //加工
      obj.wheel = wheel; //加工
      return obj; //输出产品
    }
    //实例化
    var cat1 = createCar("红色", "4");
    var cat2 = createCar("蓝色", "4");
    alert(cat1.color); //红色

    //4.构造函数模式
    function createCar(color, wheel) { //createCar工厂
      var obj = new Object; //或obj = {} 原材料阶段
      obj.color = color; //加工
      obj.wheel = wheel; //加工
      return obj; //输出产品
    }
    //实例化
    var cat1 = createCar("红色", "4");
    var cat2 = createCar("蓝色", "4");

    alert(cat1.color); //红色
  </script>

</html>